Canvas でお絵かきアプリ
とりあえず雑にやってみたもの
https://gyazo.com/332e5f5b21f5c1259255e8d2e30f7432
なんか線おかしくね？
pointermove イベントが発生する度に短くて太い線分を描画しているので、こうなるhttps://gyazo.com/3aee97f285ed8a0c28b0e935b2cdb9aa
めんどいな、どうすべきか
lineCap = "round" でも駄目でした
lineJoin = "round" ならいけるか？でもpointermoveによって作られるセグメント内での太さが一定になっちゃうからガタガタになる。やっぱ↓↓の各ポイントで丸を描きまくるほうがいい。
各ポイントで丸を描いてみるか（適当すぎ？）
https://gyazo.com/0b0951ceff921287cad7f30f525424d0
やっぱ段差めだつね～～真面目に考えるべき？→だるいぜ
点間の距離に応じて細分化して、直径を線形補間して丸をいっぱい描くのはどうか？
（線は描かないで）
https://gyazo.com/9ca0fdf3caff907a1eacffc36a96f424
いい感じでは！？！？
直径が線形補間されてる様子
（四角が pointermove イベントの発生した座標、丸は実際に描画される丸）
https://gyazo.com/cca489d682d8f0b719339b2955f02eb2
この方式は、ブラシシステムとも相性が良いのではないでしょうか
（ほんとう？）
https://gyazo.com/23ec1c9976ff10fb35321c957bdd4733
まあ描画が下手だけど技術的に可能というのがわかったのでいいかな。
傾きと方向検知してみた動画
これでビリヤードのゲーム作ってみたらおもしろくね？ #アイデア https://www.youtube.com/watch?v=sW4iCx-I9lc
方向、仕様上は PointerEvent.twistで取れるはずなんだけど iPad OS だとなぜか取れなかった…が、Math.atan2(tiltY, tiltX) で取れます。よかったですね。
↑いやこれ違くない！？！？書いてて思ったけど
数式の上では違うだろという気がしてるんだけど、なんかそれっぽい値が取れてるんだよな…よくわからん
シャッって描くとカクカクになっちゃう問題
https://gyazo.com/3341b001c647d3c5b35c33ddf7b63625
参考：ibispaintでシャッ
https://gyazo.com/3892cd74e35673913b95e50f6ef1f1d1
どう実装するんだ？ベジェ？
交互に端点、制御点、端点… と取っていって、2次ベジェ曲線を連続で描いてみよう
https://gyazo.com/3e47830ec6b596fb780d6fc69ef0998c
多少なめらかだけど微妙じゃね、、、
緑が端点、赤が制御点
https://gyazo.com/adc062660d2d442e95d37c7dea9a2714
やっぱ2次じゃだめですか？いやそもそもベジェをいっぱいつなごうというアプローチが違うような…
ググるぜ
https://gyazo.com/afbdbfb99f12d6a8a0f4c1f9f3718633
うーんムズい、スタイラスがタッチしてから離れるまでの間も線を更新しつづけたいから、これだとn重に描画されちゃわないか？
とりあえずやった
気持ちよくなってきたのできちんと UI つくる感じでやっていくか、描画アルゴリズムとは並行して進められるからね
メモ
描画途中の線は opacity 100% にしつつ globalAlpha 透明度調整する！